<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <meta name="format-detection" content="telephone=no" />
    <meta name="format-detection" content="email=no" />
    <title>首页</title>
    <link rel="stylesheet" href="../../css/api.css">
    <link rel="stylesheet" href="../../css/main.css">
    <link rel="stylesheet" href="../../css/vant.css">
    <style>
        .van-hairline--top-bottom::after {
            border-width: 0 0 0.0 0;
        }
    </style>
</head>

<body>
    <div class="app" v-cloak>
        <div class="header-common">
            <div class="flex-x-s header">
                <span class="iconfont goback" @click="backPage">&#xe66f;</span>
                <div class="search flex-x-s" @click="forwardPage('search_win', '../search/')">
                    <span class="iconfont">&#xe71e;</span>
                    <input type="search" maxlength="10" placeholder="请搜索关键词">
                </div>
                <div class="search-btn" @click="forwardPage('search_win', '../search/')">搜索</div>
            </div>
            <van-tabs v-model="activeTab" color="#3F8CEC" title-active-color="#3F8CEC" line-height="1px"
                line-width=".22rem" @click="toggleTab">
                <van-tab :title="tab.name" v-for="(tab,index) in tabs" :key="index"></van-tab>
            </van-tabs>
        </div>
    </div>
    </div>
    <script src="../../script/api.js "></script>
    <script src="../../script/flexible.js "></script>
    <script src="../../script/fastclick.js "></script>
    <script src="../../script/vue.min.js "></script>
    <script src="../../script/iconfont.js "></script>
    <script src="../../script/vant.min.js"></script>
    <script src="../../script/common.js"></script>

    <script>
        apiready = function () {
            var vm = new Vue({
                el: '.app',
                data() {
                    return {
                        value: undefined,
                        activeTab: 0,
                        tabs: [{
                            name: "售卖",
                        }, {
                            name: "求购"
                        }],
                        title: ""
                    }
                },
                mounted() {
                    var vm = this;
                    var frames = []
                    var pageParam = {}
                    for (var key in api.pageParam) {
                        pageParam[key] = api.pageParam[key]
                    }
                    this.checkTab();
                    pageParam.title = vm.title
                    if (api.pageParam.title === "整机买卖") {
                        this.tabs = [{
                            name: "售卖",
                        }, {
                            name: "求购"
                        }]
                        frames = [{
                            name: 'whole_sale_frm',
                            url: 'whole_sale_frm.html',
                            pageParam: pageParam,
                            softInputMode: 'pan'
                        }, {
                            name: 'whole_buy_frm',
                            url: 'whole_buy_frm.html',
                            pageParam: pageParam
                        }]
                        setBDPageStart("整机买卖")
                    } else if (api.pageParam.title === "租赁出租") {
                        this.tabs = [{
                            name: "出租",
                        }, {
                            name: "求租"
                        }]
                        frames = [{
                            name: 'whole_sale_frm',
                            url: 'whole_sale_frm.html',
                            pageParam: pageParam,
                            softInputMode: 'pan'
                        }, {
                            name: 'whole_buy_frm',
                            url: 'whole_buy_frm.html',
                            pageParam: pageParam
                        }]
                        setBDPageStart("租赁出租")
                    } else if (api.pageParam.title === "配件商城") {
                        this.tabs = [{
                            name: "配件商城"
                        }]
                        frames = [{
                            name: 'whole_sale_frm',
                            url: 'whole_sale_frm.html',
                            pageParam: pageParam,
                            softInputMode: 'pan'
                        }]
                        setBDPageStart("配件商城")
                    }
                    var headerH = $api.fixStatusBar($api.dom(".header-common"));
                    api.openFrameGroup({
                        name: 'whole',
                        background: '#fff',
                        scrollEnabled: true,
                        reload: true,
                        rect: {
                            marginTop: headerH + 1,
                            marginBottom: 0,
                            w: 'auto'
                        },
                        preload: 0,
                        index: 0,
                        frames: frames
                    }, function (ret, err) {
                        vm.checkTab();
                        pageParam.title = vm.title
                        vm.activeTab = ret.index;
                        api.sendEvent({
                            name: 'toggleTab',
                            extra: {
                                title: pageParam.title,
                                tabs: vm.title
                            }
                        })
                    });
                },
                methods: {
                    toggleTab(index, tabName) {
                        api.setFrameGroupIndex({
                            name: 'whole',
                            index: index,
                            scroll: true
                        });
                    },
                    checkTab() {
                        if (api.pageParam.title === "整机买卖") {
                            if (this.activeTab == 0) {
                                this.title = "SELL_DEVICE"
                            } else {
                                this.title = "BUY_DEVICE"
                            }
                        } else if (api.pageParam.title === "租赁出租") {
                            if (this.activeTab == 0) {
                                this.title = "LEASE_DEVICE"
                            } else {
                                this.title = "RENT_DEVICE"
                            }
                        } else if (api.pageParam.title === "配件商城") {
                            this.title = "PARTS"
                        }
                    },
                    backPage() {
                        if (api.pageParam.title === "整机买卖") {
                            setBDPageEnd("整机买卖")
                        } else if (api.pageParam.title === "租赁出租") {
                            setBDPageEnd("租赁出租")
                        } else if (api.pageParam.title === "配件商城") {
                            setBDPageEnd("配件商城")
                        }
                        api.closeWin();
                    },
                    forwardPage(url, relative) {
                        this.checkTab();
                        console.log(JSON.stringify(this.title));
                        console.log(JSON.stringify(api.pageParam.title));
                        api.openWin({
                            name: url,
                            url: (relative || "") + url + ".html",
                            pageParam: {
                                isHistory: false,
                                title: this.title,
                                titlePlus: api.pageParam.title
                            }
                        })
                    }
                }
            })

            api.addEventListener({
                name: 'keyback'
            }, function (ret, err) {
                if (api.pageParam.title === "整机买卖") {
                    setBDPageEnd("整机买卖")
                } else if (api.pageParam.title === "租赁出租") {
                    setBDPageEnd("租赁出租")
                } else if (api.pageParam.title === "配件商城") {
                    setBDPageEnd("配件商城")
                }
                api.closeWin();
            });
        }
    </script>
</body>

</html>